<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@include file="../hy/common.jsp"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style>
	.table th{ 
		text-align: center; 
	}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
<META HTTP-EQUIV="Expires" CONTENT="-1"> 
<title>BOM基础</title>
<script type="text/javascript">
	var limit='';
	$(function() {

		//1.初始化Table
		var oTable = new TableInit();
		oTable.Init();

		//2.初始化Button的点击事件
		var oButtonInit = new ButtonInit();
		oButtonInit.Init();
		
		// 点击查询按钮重新刷新该表，将传入的查询条件传递到后台
		$("#btn_query").click(function() {  
	        	$("#tb_departments").bootstrapTable('refresh');
			});
		
		 $("#btn_query2").click(function() {
        		/* $("#tb_departments").bootstrapTable('refresh'); */
        		/* alert($("#mNum").val()); */
        		/* function queryParams(params){
        			var temp = {
        				pageSize: params.limit,   //页面大小  
        				pageNumber: params.pageNumber,  //页码  
						mNum: $("#mNum").val(), 
        			};
        			return temp;
        		} */
        		var mNum = $("#mNum").val();
			 	$("#detailList").bootstrapTable('refresh', {url:'${pageContext.request.contextPath }/zcBom/pageQueryMaterieAll.do?mNum='+mNum});
			});
		 //修改
		 $("#btn_edit").click(function() {
			 $("#detailList").bootstrapTable('refresh', {url:'${pageContext.request.contextPath }/zcBom/pageQueryMaterieAll.do'});
		});
		});
	
		var TableInit = function() {
		var oTableInit = new Object();
		//初始化Table
		oTableInit.Init = function() {
			$('#tb_departments').bootstrapTable({
				url : '${pageContext.request.contextPath }/zcBom/pageQueryProductAll.do', //请求后台的URL（*）
				method : 'get', //请求方式（*）
				toolbar : '#toolbar', //工具按钮用哪个容器
				striped : true, //是否显示行间隔色
				cache : false, //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
				pagination : true, //是否显示分页（*）
				sortable : false, //是否启用排序
				sortOrder : "asc", //排序方式
				queryParams : oTableInit.queryParams,//传递参数（*）
				sidePagination : "server", //分页方式：client客户端分页，server服务端分页（*）
				pageNumber : 1, //初始化加载第一页，默认第一页
				pageSize : 10, //每页的记录行数（*）
				pageList : [10,20,30], //可供选择的每页的行数（*）
				strictSearch : true,
				clickToSelect : true, //是否启用点击选中行
				height : 600, //行高，如果没有设置height属性，表格自动根据记录条数觉得表格高度
				uniqueId : "ID", //每一行的唯一标识，一般为主键列
				detailView : false, //是否显示父子表
				smartDisplay : false,
				columns : [ {
					field : 'num',
					align : 'center',
					title : '品编'
				}, {
					field : 'name',
					align : 'center',
					title : '品名'
				}, {
					field : 'distinguish',
					align : 'center',
					title : '产品区分'
				}, {
					field : 'classification',
					align : 'center',
					title : '产品分类'
				}, {
					field : 'size',
					align : 'center',
					title : '产品尺寸'
				}, {
					field : 'weight',
					align : 'center',
					title : '产品重量(g)'
				}/* , {
					field : 'material',
					align : 'center',
					title : '材料选择'
				}, {
					field : 'rate',
					align : 'center',
					title : '损耗率'
				} */,{
					field : 'modulus',
					align : 'center',
					title : '产品模数'
				},{
					field : 'color',
					align : 'center',
					title : '产品颜色'
				},{
					field : 'wweight',
					align : 'center',
					title : '口水重量(g)'
				},{
					field : 'photo',
					align : 'center',
					title : '产品图片'
				},{
					field : 'remark14',
					align : 'center',
					title : '绑定状态',
					formatter: function (value, row, index) {
                        if (value == 1) {
                            return '已绑定'
                        } else {
                        	return '未绑定'
                        }
                    }
				} ],
				onClickRow : doClickRow
			});
		};
		//得到查询的参数
		oTableInit.queryParams = function(params) {
			var temp = { //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的
				limit : params.limit, 		// 每页显示多少条
				offset : params.offset, 	// 从第几页开始
				pNum : $("#pNum").val(),	// 根据产品名称搜索
			};
			return temp;
		};
		return oTableInit;
	};
	var ButtonInit = function() {
		var oInit = new Object();
		var postdata = {};

		oInit.Init = function() {
			// 初始化页面上面的按钮事件
			// oButtonInit.Init();
		};
		return oInit;
	};
	layui.use([ 'laydate' ], function() {
		var laydate = layui.laydate;
	});
	
	// 单击一行去查找物料表的所有信息，然后可以选择，选择完成以后可以保存
	/* function doClickRow(row){
		// alert(row.photo);
		document.getElementById("myDV").style.display=""; 
		// $("#myDV").style.display="";
		$("#myDV").load("/ERP/pages/hy/pinzhi.jsp");
	} */ 
	
	/* 将第一次点击的行的产品编号传递暂时保存 */
	var hiddenValue = null;
	function doClickRow(row) {
		hiddenValue = row.num;
		// alert(hiddenValue);
		//alert(row.remark14);
		
		$("#mNum").val("");
		
		$("#btn_hide").attr("data-toggle", "modal");
		$("#btn_hide").attr("data-target", "#detail");
		$("#btn_hide").click();
		if(row.remark14!=1){
			$("#detailList").bootstrapTable('refresh',{url:'${pageContext.request.contextPath }/zcBom/pageQueryMaterieAll.do'});
			$('#detailList').bootstrapTable({
				url : '${pageContext.request.contextPath }/zcBom/pageQueryMaterieAll.do', //请求后台的URL（*）
				method : 'get',
				toolbar : '#toolbar', //工具按钮用哪个容器
				striped : true, //是否显示行间隔色
				cache : false, //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
				pagination : true, //是否显示分页（*）
				sortable : false, //是否启用排序
				sortOrder : "asc", //排序方式
				sidePagination : "server", //分页方式：client客户端分页，server服务端分页（*）
				/* height: 1000, */
				/* queryParams: queryParams, */
				pageNumber : 1, //初始化加载第一页，默认第一页
				pageSize : 10, //每页的记录行数（*）
				pageList: [10, 20, 30], //可供选择的每页的行数（*）
				clickToSelect : false, //是否启用点击选中行
				uniqueId : "ID", //每一行的唯一标识，一般为主键列
				detailView : false,
				smartDispaly : false,
				columns : [ {
					checkbox : true
				}, {
					field : 'name',
					align : 'center',
					title : '名称'
				}, /* {
					field : 'number',
					align : 'center',
					title : '编号'
				},  */{
					field : 'materialmodel',
					align : 'center',
					title : '型号'
				}, {
					field : 'color',
					align : 'center',
					title : '颜色'
				}/* , {
					field : 'type',
					align : 'center',
					title : '类型'
				}, {
					field : 'classify',
					align : 'center',
					title : '分类'
				} */, {
					field : 'company',
					align : 'center',
					title : '单位'
				}, {
					field : 'supplierid',
					align : 'center',
					title : '供应商编号'
				},{
					field : 'remark1',
					align : 'center',
					title : '包装规格'
				},{
					field : 'remark2',
					align : 'center',
					title : '车种'
				},/* {
					field : 'remark3',
					align : 'center',
					title : '单价'
				},{
					field : 'remark4',
					align : 'center',
					title : '安全库存'
				}, */{
					field: 	'maternum',
					align : 'center',
					title : '用量',
					formatter:function(value,row,index){
		                  if(value=='' || value == null){return null;} 
		       			  else{return value;}                       
		     		},
	              editable:{
	             	    type:'text',
	              	validate:function(v){
	              		 if (!v) return '数量不能为空';
	              		 if (isNaN(v)) return '数量是数字';
	              	}
	              }				
				}],
			});
		}else{
			var pNum=row.num;
			$("#detailList").bootstrapTable('refresh',{url:'${pageContext.request.contextPath }/zcBom/findQueryMaterieByPid.do?pNum='+pNum});
			$('#detailList').bootstrapTable({
				url : '${pageContext.request.contextPath }/zcBom/findQueryMaterieByPid.do?pNum='+pNum, //请求后台的URL（*）
				method : 'get',
				toolbar : '#toolbar', //工具按钮用哪个容器
				striped : true, //是否显示行间隔色
				cache : false, //是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*）
				pagination : true, //是否显示分页（*）
				sortable : false, //是否启用排序
				sortOrder : "asc", //排序方式
				sidePagination : "server", //分页方式：client客户端分页，server服务端分页（*）
				/* height: 1000, */
				pageNumber : 1, //初始化加载第一页，默认第一页
				pageSize : 10, //每页的记录行数（*）
				pageList: [10, 20, 30], //可供选择的每页的行数（*）
				clickToSelect : false, //是否启用点击选中行
				uniqueId : "ID", //每一行的唯一标识，一般为主键列
				detailView : false,
				smartDispaly : false,
				columns : [ {
					checkbox : true
				}, {
					field : 'name',
					align : 'center',
					title : '名称'
				},{
					field : 'materialmodel',
					align : 'center',
					title : '型号'
				}, {
					field : 'color',
					align : 'center',
					title : '颜色'
				}/* , {
					field : 'type',
					align : 'center',
					title : '类型',
					formatter:function(value,row,index){
		                  if(value=='' || value == null){return "";} 
		       			  else{return value;}                       
		     		}
				}, {
					field : 'classify',
					align : 'center',
					title : '分类',
					formatter:function(value,row,index){
		                  if(value=='' || value == null){return "";} 
		       			  else{return value;}                       
		     		}
				} */, {
					field : 'company',
					align : 'center',
					title : '单位'
				}, {
					field : 'supplierid',
					align : 'center',
					title : '供应商编号'
				},{
					field : 'remark1',
					align : 'center',
					title : '包装规格'
				},{
					field : 'remark2',
					align : 'center',
					title : '车种'
				},{
					field: 	'maternum',
					align : 'center',
					title : '用量',
					formatter:function(value,row,index){
		                  if(value=='' || value == null){return null;} 
		       			  else{return value;}                       
		     		},
	              editable:{
	             	    type:'text',
	              	validate:function(v){
	              		 if (!v) return '数量不能为空';
	              		 if (isNaN(v)) return '数量是数字';
	              	}
	              }				
				}],
			});
		}
	}
	// 定义一个数组保存选中的数据的id
	var idArray = new Array();
	var numArray = new Array();
	// 批量提交客户选择的物料数据
	function saveMaterieInfo(){
		// alert(hiddenValue + "1222");
		// 产品名称
		// var pName = $("#pName").val();
		// alert(pName);
	    var ids = $('#detailList').bootstrapTable('getSelections');
	    console.log(ids)
	    if(ids.length<=0){
	    	toastr.warning('请选择物料信息');
	    	return false;
	    }
	    for ( var int = 0; int < ids.length; int++) {
			// alert(ids[int].name);
			// 将客户选择的数据保存到数组中
	    	if(ids[int].maternum==''){
		    	toastr.warning('请输入所选物料的数量');
		    	return false;
		    }else{
		    	idArray[int] = ids[int].id;
				numArray[int] = ids[int].maternum;
		    }
			// alert(ids[int].number);
			// remark5 = ids[int].remark5;
		}
	    //alert(numArray);
	    // 将产品名称和该数组当做参数传递到后台
	    
	   $.ajax({
	        type: "get",
	        dataType: "json",
	        url: '${pageContext.request.contextPath }/zcBom/receive2TabAndSave.do',
	        // 数组和产品名称作为参数
	        data:{"idsArray":idArray, "pNum1":hiddenValue,"numArray":numArray},
	        success: function (data) {
	        	// alert(data);
	            if (data == 1) {
	            	// 成功1
	            	// toastr.success('内容success', '标题success');
	            	// 提示2
	            	// toastr.info('内容4', '标题4',messageOpts);
	            	// 错误3
					// toastr.error('内容error', '标题error');
	            	// 警告4
					// toastr.warning('内容warning', '标题warning');
					// 清除5
					// toastr.clear();
					// 移除6
					// toastr.remove();
	                toastr.success('产品物料绑定成功');
	                $("#tb_departments").bootstrapTable('refresh');
	            }else{
	            	toastr.error('保存异常');
	            }
	        }
	    });
	}
	toastr.options.positionClass = 'toast-top-center'; //提示框的位置设置为中上
</script>
</head>
<body>
	<!-- 物料明细  -->
	<div class="modal fade" id="detail" tabindex="-1" role="dialog" aria-labelledby="detailLabel" aria-hidden="true" data-backdrop="static" data-keyboard="false">
		<div class="modal-dialog" style="width: 70%; height: 40%">
			<div class="modal-content">
				<!-- 
					<div class="modal-header">
						<button type="button" class="close" data-dismiss="modal" aria-label="Close" aria-hidden="true">&times;</button>
						<h4 class="modal-title" id="detailLabel1">物料绑定</h4>
					</div> 
				-->
				<div class="panel panel-default">
					<div class="panel-heading">产品物料绑定</div>
						<div class="panel-body">
							<form id="formSearch1" class="form-horizontal">
								<div class="form-group" style="margin-top: 15px">
									<label class="control-label col-sm-1" for="pickDate">物料名称:</label>
									<div class="col-sm-3">
										<input type="text" class="form-control" id="mNum" name="mNum" placeholder="请输入物料名称">
									</div>
									<div class="col-sm-2" align="right">
										<button type="button" style="width: 150px;" id="btn_query2" class="btn btn-primary">查询</button>
									</div>
									<div class="col-sm-2" align="right">
										<button type="button" style="width: 150px;" id="btn_edit" class="btn btn-primary">修改</button>
									</div>
								</div>
							</form>
						</div> 
				</div> 
				<div class="modal-body" id="myDV">
					<form>
						<table id="detailList" width="90%" align="center" class="table table-bordered"></table>
					</form>
				</div>
				<div class="modal-footer">
					<button type="button" id="save" class="btn btn-default" data-dismiss="modal" onclick="saveMaterieInfo()">保存</button>
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
				</div>
			</div>
		</div>
	</div>
	
	<div class="panel-body" style="padding-bottom: 0px;">
		<div class="panel panel-default">
			<div class="panel-heading">查询条件</div>
			<div class="panel-body">
				<form id="formSearch" class="form-horizontal">
					<div class="form-group" style="margin-top: 15px">
						<label class="control-label col-sm-1" for="pickDate">品名:</label>
						<div class="col-sm-3">
							<input type="text" class="form-control" id="pNum" name="pNum" placeholder="请输入品名">
						</div>
						<div class="col-sm-2" align="right">
							<button type="button" style="width: 150px;" id="btn_query" class="btn btn-primary">查询</button>
						</div>
					</div>
				</form>
			</div>
		</div>
		<div id="toolbar" class="btn-group">
			<button id="btn_hide" type="button" value="" class="btn btn-default" style="display: none;">
				<span class="glyphicon glyphicon-cancel" aria-hidden="true"></span>隐藏
			</button>
		</div>
		<table id="tb_departments"></table>
	</div>
</body>
</html>